import React from 'react';
import {Tabs} from 'antd';
import MobileList from './mobile_list';
import ComponentsCarousel from '../carousel';

const TabPane = Tabs.TabPane;

export default class MobileNav extends React.Component {
    render() {
        let CarouselStyle = {
            padding: '5px 0'
        }
        return (
            <Tabs>
                <TabPane tab="首页" key="1">
                    <div style={CarouselStyle}>
                        <ComponentsCarousel/>
                    </div>
                    <MobileList count={20} type={'top'}/>
                </TabPane>
                <TabPane tab="社会" key="2">
                    <div style={CarouselStyle}>
                        <ComponentsCarousel/>
                    </div>
                    <MobileList count={20} type={'shehui'}/>
                </TabPane>
                <TabPane tab="国内" key="3">
                    <div style={CarouselStyle}>
                        <ComponentsCarousel/>
                    </div>
                    <MobileList count={20} type={'guonei'}/>
                </TabPane>
                <TabPane tab="国际" key="4">
                    <div style={CarouselStyle}>
                        <ComponentsCarousel/>
                    </div>
                    <MobileList count={20} type={'guoji'}/>
                </TabPane>
                <TabPane tab="娱乐" key="5">
                    <div style={CarouselStyle}>
                        <ComponentsCarousel/>
                    </div>
                    <MobileList count={20} type={'yule'}/>
                </TabPane>
            </Tabs>
        );
    };
};
